<html>
<head>
    <title>Microsoft Teams ME Action WebView</title>
    <script src="https://statics.teams.microsoft.com/sdk/v1.7.0/js/MicrosoftTeams.min.js"></script>
    <script>
    microsoftTeams.initialize();
        function validateForm() {
            let empInfo = {
                EmpId: document.forms["empForm"]["empId"].value,
                EmpName: document.forms["empForm"]["empName"].value,
                EmpEmail: document.forms["empForm"]["empEmail"].value
            }
            microsoftTeams.tasks.submitTask(empInfo);
            return true;
        }
    </script>
    <style>
            .login {
                text-align: center;
            }
    </style>

</head>
<body>
    <div class="surface theme-light">
        <div class="panel">
            <div class="login">
            <h2>Enter Details</h2><br>
            <form id="empForm" onSubmit="return validateForm()">
                <label>
                    <b> Employee ID: </b>
                </label>
                <input type="text" placeholder="Employee id" name="empId">
                <br><br>
                <label>
                    <b>Name:&emsp;&emsp;&emsp;</b>
                </label>
                <input type="text" placeholder="Employee Name" name="empName">
                <br><br>
                <label>
                    <b>E-Mail:&emsp;&emsp;&ensp;</b>
                </label>
                <input type="email" placeholder="e-mail ID" name="empEmail">
                <br><br>
                <input type="submit" value="Submit">
            </form>
            </div>
        </div>
    </div>

</body>
